//这里面存放 vuex 相关的核心代码
//导入包 两个
import Vue from 'vue'
import Vuex from 'vuex'

//导入 user 模块 和setting 模块
import user from '@/modules/user'
import setting from '@/modules/setting'

//插件安装
Vue.use(Vuex)

//创建仓库
const store = new Vuex.Store({
    //state 状态 即数据 
    //data 是 组件自己的数据
    //state 是 所有组件共享的数据
    state: {
        title:'大标题',
        count: 100,
        list:[1,2,3,4,5,6,7,8,9,10]
    },

    //提供 mutations 修改数据的方法
    mutations: {
        //所有 mutations 函数中的第一个参数都是 state
        addCount (state){
            state.count += 1
        },
        delCount(state){
            state.count -= 1
        },
        //可以自定义 值的修改大小 不用写多个函数 来加减
        changeCount(state,n)
        {
            state.count += n
        },
        //封装 mutation 函数
        change(state,newCount){
            state.count= newCount
        }
    },

    //actions 异步操作
    //actions中不能直接 操作 state 需要 commit mutation 操作state
    actions:{
        //context 上下文 (此处未分模块, 可以当成仓库)
        //context.commit ('mutation名字',额外参数)
        changeCountAction(context, num){
            //setTimeout 模拟异步 以后大部分场景是发请求
            setTimeout(()=>{
                context.commit ('change',num)
            },1000)
        }
    },
    
    //getters 类似计算属性
    getters:{
        filterList(state){
           return state.list.filter(item=> item>5)
        }
    },
    // modules 模块挂载user模块和setting模块
    modules:{
        user,
        setting 
    }
})
//导出使用
export default store 